{% load staticfiles %}
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->

    <title>{% block title %}E+酒店管理系统{% endblock %}</title>

    <!-- Bootstrap core CSS -->
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="/static/css/dashboard.css" rel="stylesheet">
    <link href="/static/css/navBar.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/d3/3.2.1/d3.js"></script>
    <!-- <script src="/static/js/dashboard.js"></script> -->
    <script src="/static/js/navOptions.js"></script>
    <script src="/static/js/navBar.js"></script>
    <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.js"></script>
    {% block custom_css %}{% endblock %}
</head>

<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
                    aria-expanded="false" aria-controls="navbar">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="/">E+酒店管理系统</a>
            </div>
            <div id="navbar" class="navbar-collapse collapse">
                <ul class="nav navbar-nav navbar-right">
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                            aria-expanded="false">{{user.username}}<span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="/change_pwd">修改密码</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="/logout">注销</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <div class="container-fluid">

        <div class="row">
            <div class="navBarOut">
                <div class="navBar">
                    <ul class="navBar_ul" style="height: 738px;">
                        <li id="page3"><a class="first_nav_name"
                                onclick="navSwitchShowmore('page3')"><span>入住管理</span><img
                                    src="/static/img/show-more.png" class="showMore"></a>
                            <ul class="secNavBar_ul" {% if display == 1 %} style="display:block;" {% endif %}>
                                <li><a id="page3_2" class="second_nav_name {% if active == 'enter' %}active{% endif %}"
                                        href="/enter">入住登记</a></li>
                                <li><a id="page3_2"
                                        class="second_nav_name {% if active == 'reservation' %}active{% endif %}"
                                        href="/reservation">房间预订</a></li>
                                <li><a id="page3_2"
                                        class="second_nav_name {% if active == 'check_out' %}active{% endif %}"
                                        href="/check_out">申请退房</a></li>
                                <li><a id="page3_2"
                                        class="second_nav_name {% if active == 'vacancy' %}active{% endif %}"
                                        href="/vacancy">查询空房</a></li>
                            </ul>
                        </li>
                        <li id="page5"><a class="first_nav_name"
                                onclick="navSwitchShowmore('page5')"><span>信息查询</span><img
                                    src="/static/img/show-more.png" class="showMore"></a>
                            <ul class="secNavBar_ul" {% if display == 2 %} style="display:block;" {% endif %}>
                                <!-- <li><a id="page3_1" class="second_nav_name" href="#31">查询登记</a></li> -->
                                <li><a id="page5_1"
                                        class="second_nav_name {% if active == 'enter_info' %}active{% endif %}"
                                        href="/enter_info">入住信息</a></li>
                                <li><a id="page5_3"
                                        class="second_nav_name {% if active == 'reservation_info' %}active{% endif %}"
                                        href="/reservation_info">预约信息</a></li>
                                <li><a id="page5_2" class="second_nav_name {% if active == 'order' %}active{% endif %}"
                                        href="/order">订单查询</a></li>
                                <li><a id="page5_2"
                                        class="second_nav_name {% if active == 'statement' %}active{% endif %}"
                                        href="/statement">营收报表</a></li>
                            </ul>
                        </li>
                        <li id="page6"><a class="first_nav_name"
                                onclick="navSwitchShowmore('page6')"><span>房间管理</span><img
                                    src="/static/img/show-more.png" class="showMore"></a>
                            <ul class="secNavBar_ul" {% if display == 3 %} style="display:block;" {% endif %}>
                                <!-- <li><a id="page6_1" class="second_nav_name" href="#61">楼层管理</a></li> -->
                                <li><a id="page6_2"
                                        class="second_nav_name {% if active == 'room_info' %}active{% endif %}"
                                        href="/room_info">房间信息</a></li>
                                <li><a id="page6_3"
                                        class="second_nav_name {% if active == 'room_type' %}active{% endif %}"
                                        href="/room_type">房间类型</a></li>
                                <li><a id="page6_4"
                                    class="second_nav_name {% if active == 'room_hot' %}active{% endif %}"
                                    href="/room_hot">高峰房价</a></li>
                            </ul>
                        </li>
                        <li id="page7"><a class="first_nav_name"
                                onclick="navSwitchShowmore('page7')"><span>人员管理</span><img
                                    src="/static/img/show-more.png" class="showMore"></a>
                            <ul class="secNavBar_ul" {% if display == 4 %} style="display:block;" {% endif %}>
                                <li><a id="page7_1" class="second_nav_name {% if active == 'client' %}active{% endif %}"
                                        href="/client">会员信息</a></li>
                                <li><a id="page7_2" class="second_nav_name {% if active == 'staff' %}active{% endif %}"
                                        href="/staff">工作人员</a></li>
                            </ul>
                        </li>
                        <li id="page8"><a class="first_nav_name"
                                onclick="navSwitchShowmore('page8')"><span>系统设置</span><img
                                    src="/static/img/show-more.png" class="showMore"></a>
                            <ul class="secNavBar_ul" {% if display == 5 %} style="display:block;" {% endif %}>
                                <li><a id="page8_1"
                                        class="second_nav_name {% if active == 'change_pwd' %}active{% endif %}"
                                        href="/change_pwd">修改密码</a></li>
                                <li><a id="page8_2" class="second_nav_name" href="/logout">退出系统</a></li>
                                <!-- <li><a id="page8_4" class="second_nav_name {% if active == 'about' %}active{% endif %}"
                                        href="/about">关于我们</a></li> -->
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
            {% block content %}
            {% endblock %}
        </div>
        <!-- <nav id="footer" class="navbar navbar-default"
            style="background-color: rgba(255,255,255,0);border-width: 0px;margin-bottom: 10px;">
            <div class="container">
                <div class="row">
                    <div class="text-center ">
                        <p id='footer-text'></p>
                    </div>
                </div>
            </div>
        </nav> -->
    </div>
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
    <script>
        function showUnreadNews() {
            $(document).ready(function () {
                $.ajax({
                    type: "GET",
                    url: "/get_message",
                    success: function (result) {
                        if (result.msg) {
                            // layer.msg(result.msg);
                            layer.open({
                                type: 2,
                                title: false,
                                closeBtn: 1,
                                shade: [0],
                                area: ['340px', '100px'],
                                offset: 'rb',
                                // time:5000,
                                anim: 2,
                                content: ['/message', 'no'],
                            });
                        }
                        // $.each(msg, function (id, title) {
                        //     $("#news").append("<a href=detailnews.aspx?id=" + id + ">" +
                        //         title + "</a><br>");
                        // });
                    }
                });
            });
        }
        setInterval('showUnreadNews()', 5000);
        // window.onload = function () {
        //     if (document.documentElement.clientHeight < document.documentElement.offsetHeight-4) {
        //         document.getElementById('footer').setAttribute('class', 'navbar-absolute-bottom')
        //     } else {
        //         document.getElementById('footer').setAttribute('class', 'navbar-fixed-bottom')
        //     }
        //     document.getElementById('footer-text').innerText='Copyright © 2019 郑州大学软件与应用科技学院'
        // };
    </script>

</body>

</html>